// Core variables and mixins
@import 'variables';
@import 'mixins';
@import 'fonts';
@import 'theme-default';
@import 'thumbnail';
@import 'video';
@import 'autoplay';
@import 'zoom';
@import 'pager';
@import 'fullscreen';

// Clearfix
.group {
  *zoom: 1;
}

.group:before,
.group:after {
  display: table;
  content: '';
  line-height: 0;
}

.group:after {
  clear: both;
}

// lightgallery core
.tglider-outer {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: $zindex-outer;
  opacity: 0;
  // For start/end transition
  @include transition(opacity 0.15s ease 0s);

  * {
    @include box-sizing(border-box);
  }

  &.tglider-visible {
    opacity: 1;
  }

  // Set transition speed and timing function
  &.tglider-css3 {
    .tglider-item {
      &.tglider-prev-slide,
      &.tglider-next-slide,
      &.tglider-current {
        @include transition-duration(inherit !important);
        @include transition-timing-function(inherit !important);
      }
    }
  }

  // Remove transition while dragging
  &.tglider-css3.tglider-dragging {
    .tglider-item {
      &.tglider-prev-slide,
      &.tglider-next-slide,
      &.tglider-current {
        @include transition-duration(0s !important);
        opacity: 1;
      }
    }
  }

  // Set cursor grab while dragging
  &.tglider-grab {
    img.tglider-object {
      @include grab-cursor;
    }
  }

  &.tglider-grabbing {
    img.tglider-object {
      @include grabbing-cursor;
    }
  }

  .lg {
    height: 100%;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    max-height: 100%;
  }

  .tglider-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
  }

  .tglider-item {
    background: url('#{$tglider-path-images}/loading.gif') no-repeat scroll
      center center transparent;
    display: none !important;
  }
  &.tglider-css3 {
    .tglider-prev-slide,
    .tglider-current,
    .tglider-next-slide {
      display: inline-block !important;
    }
  }
  &.tglider-css {
    .tglider-current {
      display: inline-block !important;
    }
  }

  .tglider-item,
  .tglider-img-wrap {
    display: inline-block;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;

    &:before {
      content: '';
      display: inline-block;
      height: 50%;
      width: 1px;
      margin-right: -1px;
    }
  }

  .tglider-img-wrap {
    position: static;
    padding: 0 5px;
  }

  .tglider-item {
    &.tglider-complete {
      background-image: none;
    }

    &.tglider-current {
      z-index: $zindex-item;
    }
  }

  .tglider-image {
    display: inline-block;
    vertical-align: middle;
    max-width: 100%;
    max-height: 100%;
    width: auto !important;
    height: auto !important;
  }

  &.tglider-show-after-load {
    .tglider-item {
      .tglider-object,
      .tglider-video-play {
        opacity: 0;
        @include transition(opacity 0.15s ease 0s);
      }

      &.tglider-complete {
        .tglider-object,
        .tglider-video-play {
          opacity: 1;
        }
      }
    }
  }

  // Hide title div if empty
  .tglider-empty-html {
    display: none;
  }

  &.tglider-hide-download {
    #tglider-download {
      display: none;
    }
  }
}
.tglider-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: $zindex-backdrop;
  background-color: rgba(0, 0, 0, 0.7);
  //background-color: #000;
  opacity: 0;
  @include transition(opacity 0.15s ease 0s);
  &.in {
    opacity: $backdrop-opacity;
  }
}

// Default slide animations. Should be placed at the bottom of the animation css
.tglider-css3 {
  // Remove all transition effects
  &.tglider-no-trans {
    .tglider-prev-slide,
    .tglider-next-slide,
    .tglider-current {
      @include transitionCustom(none 0s ease 0s !important);
    }
  }
  .no-trans {
    &.tglider-prev-slide,
    &.tglider-next-slide,
    &.tglider-current {
      @include transitionCustom(none 0s ease 0s !important);
    }
  }

  &.tglider-use-css3 {
    .tglider-item {
      @include backface-visibility(hidden);
    }
  }

  &.tglider-use-left {
    .tglider-item {
      @include backface-visibility(hidden);
    }
  }

  // Fade mode
  &.tglider-fade {
    .tglider-item {
      opacity: 0;

      &.tglider-current {
        opacity: 1;
      }

      // transition timing property and duration will be over written from javascript
      &.tglider-prev-slide,
      &.tglider-next-slide,
      &.tglider-current {
        @include transitionCustom(opacity 0.1s ease 0s);
      }
    }
  }

  &.tglider-slide {
    &.tglider-use-css3 {
      .tglider-item {
        opacity: 0;

        &.tglider-prev-slide {
          @include translate3d(-100%, 0, 0);
        }

        &.tglider-next-slide {
          @include translate3d(100%, 0, 0);
        }

        &.tglider-current {
          @include translate3d(0, 0, 0);
          opacity: 1;
        }

        // transition timing property and duration will be over written from javascript
        &.tglider-prev-slide,
        &.tglider-next-slide,
        &.tglider-current {
          @include transitionCustom(
            transform 1s cubic-bezier(0, 0, 0.25, 1) 0s,
            opacity 0.1s ease 0s
          );
        }
      }
    }

    &.tglider-use-left {
      .tglider-item {
        opacity: 0;
        position: absolute;
        left: 0;

        &.tglider-prev-slide {
          left: -100%;
        }

        &.tglider-next-slide {
          left: 100%;
        }

        &.tglider-current {
          left: 0;
          opacity: 1;
        }

        // transition timing property and duration will be over written from javascript
        &.tglider-prev-slide,
        &.tglider-next-slide,
        &.tglider-current {
          @include transitionCustom(
            left 1s cubic-bezier(0, 0, 0.25, 1) 0s,
            opacity 0.1s ease 0s
          );
        }
      }
    }
  }
}
